<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>块级元素与行内元素</title>
</head>
<body>
    <!-- 块级元素，特点：独占一行 -->
    <!-- <marquee>尚硅谷</marquee>
    <marquee>尚硅谷</marquee>
    <h1>尚硅谷</h1>
    <h1>尚硅谷</h1>
    <p>尚硅谷</p>
    <p>尚硅谷</p>
    <div>尚硅谷</div>
    <div>尚硅谷</div> -->

    <!-- 行内元素，特点：不独占一行 -->
    <!-- <input type="text">
    <input type="text">
    <span>尚硅谷</span>
    <span>尚硅谷</span> -->  

    <!-- 规则1：块级元素中能写：行内元素、块级元素（几乎什么都能写） -->
    <!-- <div>
        <span>尚硅谷1</span>
        <input type="text">
        <div>尚硅谷2</div>
    </div> -->

    <!-- 规则2：行内元素中能写：行内元素，但不能写：块级元素 -->
    <!-- <span>
        <span>尚硅谷1</span>
        <input type="text">
        <span>尚硅谷2</span>
    </span>
    <span>尚硅谷4</span> -->

    <!-- 特殊规则：h1-h6不能互相嵌套 -->
    <!-- <h1>
        尚硅谷1
        <h2>尚硅谷2</h2>
    </h1> -->

    <!-- 特殊规则：p标签中不能写块元素 -->
    <p>
        <h1>尚硅谷</h1>
    </p>

</body>
</html>